<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>local-music</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta http-equiv="Cache-Control" content="max-age=180">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no, viewport-fit=cover">
    <meta http-equiv="x-dns-prefetch-control" content="on">

    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/me.css">
    <link rel="stylesheet" href="css/local-music.css">
    <script src="js/common.js"></script>
    <style>

    </style>



</head>
<body>
<!--h5标签,语义化加强。用法和div相同，可以多个存在，在不是id标签的情况下-->
<!--<header id="header">-->

<!--</header>-->
<!--<nav id="nav"></nav>-->
<!--<div id="slide"></div>-->
<!--<main id="main"></main>-->
<!--&lt;!&ndash;section里包含article&ndash;&gt;-->
<!--<section id="xg"></section>-->
<!--<aside></aside>-->
<!--<footer id="footer"></footer>-->
<div id="head">
    <a href="me.html" class="box1-a">
        <img src="images/left.png" alt="" class="box1-img">
    </a>

    <div id="box1-div">
        <span class="fl">单曲</span>
        <span class="fl">节目</span>
        <span class="fr">MV</span>
    </div>
    <!--<input type="text" id="input1" placeholder="给你推荐Wolves"/>-->
    <img src="images/playing.png" alt="" class="box1-img" style="margin-left: 1.6em;">
    <div id="box1-below" style="border: none">
        <div class="box1-b-r fl">歌曲7</div>
        <div class="box1-b-r fl" style="border-left: 0.1rem solid #FF4500;border-right: 0.1rem solid #FF4500;">歌手7</div>
        <div class="box1-b-r fl">专辑7</div>
    </div>

</div>

<main id="main">
    <input type="text" placeholder="搜索本地歌曲">
</main>
<div style="clear: both"></div>
<div id="play">
    <img src="images/footer-2.png" alt="" class="play-img-1 fl">
    <span class="play-span1 fl">播放全部</span>
    <span class="play-span1 fr">管理</span>
    <img src="images/2-setting.png" alt="" class="play-img-2 fr">

</div>


    <ul class="ulist">
        <!--<li>-->
            <!--<div class="ulist-div fl">-->
                <!--<h3>侧脸</h3>-->
                <!--<p>随意的内容111111111</p>-->
            <!--</div>-->
           <!--<div class="ulist-div-1 fr">···</div>-->
        <!--</li>-->
        <!--<li>-->
            <!--<div class="ulist-div fl">-->
                <!--<h3>侧脸</h3>-->
                <!--<p>随意的内容111111111</p>-->
            <!--</div>-->
            <!--<div class="ulist-div-1 fr">···</div>-->
        <!--</li>-->
        <!--<li>-->
            <!--<div class="ulist-div fl">-->
                <!--<h3>侧脸</h3>-->
                <!--<p>随意的内容111111111</p>-->
            <!--</div>-->
            <!--<span class="ulist-div-1 fr">···</span>-->
        <!--</li>-->
    </ul>

<script src="js/local-music.js"></script>
<footer id="footer" style="height: 3.6rem">
    <div class="footer-div fl">
        <a href="shouye.html">
            <img src="images/footer-1new.png" alt="">
        </a>

        <p>发现</p>
    </div>
    <div class="footer-div fl">
        <img src="images/footer-2.png" alt="">
        <p>视频</p>
    </div>
    <div class="footer-div fl">
        <a href="me.html">
            <img src="images/footer-3new.png" alt="">
        </a>

        <p>我的</p>
    </div>
    <div class="footer-div fl">
        <img src="images/footer-4.png" alt="">
        <p>朋友</p>
    </div>
    <div class="footer-div fl">

        <a href="account.html">
            <img src="images/footer-5.png" alt="">
        </a>

        <p>账号</p>
    </div>
</footer>
<script>

</script>
</body>
</html>